<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ include file="/common/base.jsp"%>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <title>派送CMS</title>
    <link rel="stylesheet" href="${ctx}/styles/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${ctx}/styles/login.css">
</head>

<body class="container">
    <header>
        <h1>派送CMS登录</h1>
    </header>
    <section>
        <form>
            <div id="div_message"></div>
            <div class="form-group">
                <label for="txt_account">用户名：</label>
                <input type="text" class="form-control" placeholder="用户名" id="txt_account">
            </div>
            <div class="form-group">
                <label for="txt_passwd">密码：</label>
                <input type="password" class="form-control" placeholder="密码" id="txt_passwd">
            </div>
            <div>
                <button id="btn_submit" type="button" class="btn btn-default" >登录</button>
            </div>
        </form>
    </section>
    <script src="${ctx}/scripts/jquery/jquery-1.11.3.min.js"></script>
    <script src="${ctx}/scripts/bootstrap/bootstrap.min.js"></script>
    <script src="${ctx}/scripts/util.js"></script>
    <script>
    var txtAccount = $("#txt_account");
    var txtPasswd = $("#txt_passwd");
    $(document).ready(function() {
        $("#btn_submit").click(function() {
            var accountVal = txtAccount.val();
            var passwdVal = txtPasswd.val();
            if (loginFormVaild(accountVal, passwdVal)) {
                var params = {
                    "account": accountVal,
                    "passwd": passwdVal
                };
                $.ajax({
                    type: "POST",
                    url: "${ctx}/login",
                    data: params,
                    dataType: "json",
                    success: function(data) {
                        if (data.success) {
                            window.location.href = "${ctx}/index";
                        } else {
                            alertMessage(data.message, "danger");
                        }
                    }
                });
            }
        })
        
        $("#txt_account,#txt_passwd").keydown(function(e){
        	if(e.keyCode == 13){
        		$("#btn_submit").click();
        	}
        });
    })

    function loginFormVaild(account, passwd) {
        account = $.trim(account);
        passwd = $.trim(passwd);
        if (account.length === 0) {
            alertMessage("请输入账号！", "warning");
            txtAccount.focus();
            return false;
        }
        if (passwd.length === 0) {
            alertMessage("请输入密码！", "warning");
            txtPasswd.focus();
            return false;
        }
        return true;
    }

    function alertMessage(msg, level) {
        var elMessage = $("#div_message");
        elMessage.removeClass();
        if (msg != null) {
            elMessage.html(msg);
            if (level == "info" || level == "warning" || level == "danger") {
                elMessage.addClass("bg-" + level);
            }
            elMessage.fadeIn(1000);
        } else {
            elMessage.fadeOut(1000);
            elMessage.html("");
        }
    }
    </script>
</body>

</html>
